<template>
	<view class="">
		<view class="search2-top">
			<view class="search2-top-left" @click="backFn">
				<image class="search2-top-left-img" src="@/static/images/search1/back.png" mode=""></image>
			</view>
			<view class="search" @click="backSearch">
				<image class="search-img" src="../../static/images/realestate/cha@3x.png" mode=""></image>
			</view>

			<view class="search2-top-center songti"> 不动产登记—网通办 </view>
			<view class="search2-top-right">
				<view class="search2-top-button songti"> 关于 </view>
				<view class="search2-top-button songti"> 订阅 </view>
			</view>
		</view>
		<view class="Ownership songti"> 权属证明 </view>
		<view class="back-bg">
			<view class="top">
				<view class="left">
					<image class="fang" src="../../static/images/realestate/quan.png" mode=""></image>
					<image class="search" src="../../static/images/realestate/search.png" mode=""></image>
					<view class="left2"> 1 </view>
					<view class="left3"> /1 </view>
				</view>
				<view class="right">
					<view class="jian"> - </view>
					<view class="xian"> </view>
					<view class="jia"> + </view>
				</view>
			</view>

			<image src="https://www.zuoxinfangqiye.cn/static/1234.png"
				style="position: absolute; top: 17rpx; left: 31px; width: 63%;  height: 170rpx; clip-path: inset(49% 0 0 5%);z-index: 1;"></image>
			<image src="https://www.zuoxinfangqiye.cn/static/1234.png"
				style="position: absolute; top: 27%; left: 50rpx; width: 63%; height: 170rpx;z-index: 1;"></image>
				
				
			<image src="https://www.zuoxinfangqiye.cn/static/1234.png"
				style="position: absolute; top: 25%; left: 541rpx;width: 63%;  height: 170rpx;clip-path: inset(0 66% 0 0);z-index: 1;"></image>
				<image src="https://www.zuoxinfangqiye.cn/static/1234.png"
					style="position: absolute; top: 45%; left: 541rpx; width: 63%;  height: 170rpx;clip-path: inset(0 66% 0 0);z-index: 1;"></image>
			<view class="bottom">
				<!-- <image src="https://www.zuoxinfangqiye.cn/static/1234.png"
					style="position: absolute; top: 100rpx; left: 117px; width: 63%;  height: 170rpx;"></image> -->
				<image src="https://www.zuoxinfangqiye.cn/static/1234.png"
					style="position: absolute; top: 52%; left: 50rpx; width: 63%;  height: 170rpx;z-index: 1;"></image>
				<view class="biaoge">
					
					<view class="biaoge-top songti"> 山东省不动产登记信息查询 </view>
					<view class="biaoge-bianhao songti"
						style="font-size: 15rpx;transform: scale(0.7); transformOrigin: right">
						<!-- 查档编号： QS3706{{card1.quhao}}-{{bianhaoo}}-{{bawei}} -->
						查档编号：{{table1.chadang_number}}
					</view>
					<table class="table-b" v-if="xinxis.a == 0">
						<tr>
							<td class="songti" width="19%">
								<view class="aa">
									被查询人
								</view>
							</td>
							<td class="songti" width="18%">
								<view class="aa">
									姓名
								</view>
							</td>
							<td class="songti" width="14%">
								<view class="aa">
									{{ xinxi.real_name }}
								</view>
							</td>
							<td class="songti" width="14%">
								<view class="aa">
									证件号
								</view>
							</td>
							<td class="songti" width="30%" colspan="2">
								<view class="aa">
									{{ xinxi.card }}
								</view>
							</td>
						</tr>
						<tr>
							<td colspan="6" class="songti">
								<view class="aa">
									未查询到不动产信息
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									不动产状况
								</view>
							</td>
							<td colspan="5" class="songti">
								<view class="aa">
									无
								</view>
							</td>
						</tr>
					</table>
					<table class="table-b" v-if="xinxis.a != '0' && xinxis.b > 0" >
						<tr>
							<td class="songti" width="19%">
								<view class="aa">
									被查询人
								</view>
							</td>
							<td class="songti" width="18%">
								<view class="aa">
									姓名
								</view>
							</td>
							<td class="songti" width="14%">
								<view class="aa">
									{{ xinxi.real_name }}
								</view>
							</td>
							<td class="songti" width="14%">
								<view class="aa">
									证件号
								</view>
							</td>
							<td class="songti" width="30%" colspan="2">
								<view class="aa">
									{{ xinxi.card }}
								</view>
							</td>
						</tr>
						<tr>
							<td colspan="6" class="songti">
								<view class="aa">
									共 1 条记录，详情如下表:
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									房 1 坐落
								</view>
							</td>
							<td colspan="5" class="songti">
								<view class="aa">
									{{ table1.fang_zuoluo }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									不动产单元号
								</view>
							</td>
							<td colspan="5" class="songti">
								<view class="aa">
									{{ table1.number_danyuan }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti" rowspan="8">
								<view class="aa">
									不动产状况
								</view>
							</td>
							<td class="songti">
								<view class="aa">
									权力人
								</view>
							</td>
							<td class="songti" colspan="5">
								<view class="aa">
									{{ table1.quanli_people }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									证件号
								</view>
							</td>
							<td colspan="5" class="songti">
								<view class="aa">
									{{ table1.card }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									面积（m²）
								</view>
							</td>
							<td class="songti" colspan="2">
								<view class="aa">
									{{ table1.mianji }}
								</view>
							</td>
							<td class="songti" width="15%">
								<view class="aa">
									用途
								</view>
							</td>
							<td class="songti">
								<view class="aa">
									{{ table1.yongtu }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									共有情况
								</view>
							</td>
							<td class="songti" colspan="2">
								<view class="aa">
									{{ table1.gongyouqingkuang }}
								</view>
							</td>
							<td class="songti">
								<view class="aa">
									登记时间
								</view>
							</td>
							<td class="songti">
								<view class="aa">
									<rich-text :nodes="table1.dengji_time"></rich-text>
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									权利状态
								</view>
							</td>
							<td class="songti" colspan="2">
								<view class="aa">
									{{ table1.quanli_status }}
								</view>
							</td>
							<td class="songti">
								<view class="aa">
									权利性质
								</view>
							</td>
							<td class="songti">
								<view class="aa">
									{{ table1.quanli_xingzhi }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									使用期限
								</view>
							</td>
							<td class="songti" colspan="5">
								<view class="aa">
									{{ table1.use_time }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									限制状态
								</view>
							</td>
							<td class="songti" colspan="5">
								<view class="aa">
									{{ table1.xianzhi_status }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									附记
								</view>
							</td>
							<td class="songti" colspan="5"></td>
						</tr>
					</table>




					<table class="table-b" v-if="xinxis.a != 0 && xinxis.b < 0">
						<tr>
							<td class="songti" width="19%">
								<view class="aa">
									被查询人
								</view>
							</td>
							<td class="songti" width="18%">
								<view class="aa">
									姓名
								</view>
							</td>
							<td class="songti" width="14%">
								<view class="aa">
									{{ xinxi.real_name }}
								</view>
							</td>
							<td class="songti" width="14%">
								<view class="aa">
									证件号
								</view>
							</td>
							<td colspan="2" width="30%" class="songti" style="">
								<view class="aa">
									{{ xinxi.card }}
								</view>
							</td>
						</tr>
						<tr>
							<td colspan="6" class="songti">
								<view class="aa">
									共 1 条记录，详情如下表:
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									房 1 坐落
								</view>
							</td>
							<td colspan="5" class="songti">
								<view class="aa">
									{{ table1.fang_zuoluo }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									不动产单元号
								</view>
							</td>
							<td colspan="5" class="songti">
								<view class="aa">
									{{ table1.number_danyuan }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti" rowspan="8">
								<view class="aa">
									不动产状况
								</view>
							</td>
							<td class="songti">
								<view class="aa">
									权力人
								</view>
							</td>
							<td class="songti" colspan="4">
								<view class="aa">
									{{ table1.quanli_people }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									证件号
								</view>
							</td>
							<td colspan="4" class="songti">
								<view class="aa">
									{{ table1.card }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									面积（m²）
								</view>
							</td>
							<td class="songti" colspan="2">
								<view class="aa">
									{{ table1.mianji }}
								</view>
							</td>
							<td class="songti" width="15%">
								<view class="aa">
									用途
								</view>
							</td>
							<td class="songti">
								<view class="aa">
									{{ table1.yongtu }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									共有情况
								</view>
							</td>
							<td class="songti" colspan="2">
								<view class="aa">
									{{ table1.gongyouqingkuang }}
								</view>
							</td>
							<td class="songti">
								<view class="aa">
									登记时间
								</view>
							</td>
							<td class="songti">
								<view class="aa">
									<rich-text :nodes="table1.dengji_time"></rich-text>
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									权利状态
								</view>
							</td>
							<td class="songti" colspan="2">
								<view class="aa">
									{{ table1.quanli_status }}
								</view>
							</td>
							<td class="songti">
								<view class="aa">
									权利性质
								</view>
							</td>
							<td class="songti">
								<view class="aa">
									{{ table1.quanli_xingzhi }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									使用期限
								</view>
							</td>
							<td class="songti" colspan="4">
								<view class="aa">
									{{ table1.use_time }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									限制状态
								</view>
							</td>
							<td class="songti" colspan="4">
								<view class="aa">
									{{ table1.xianzhi_status }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									附记
								</view>
							</td>
							<td class="songti" colspan="4"></td>
						</tr>
						<tr>
							<td class="songti" rowspan="5">
								<view class="aa">
									抵押状况
								</view>
							</td>
							<td class="songti">
								<view class="aa">
									抵押权人
								</view>
							</td>
							<td class="songti" colspan="4">
								<view class="aa">
									{{ table1.diyaquanren }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									抵押类型
								</view>
							</td>
							<td class="songti" style="" colspan="2">
								<view class="aa">
									{{ table1.diya_style }}
								</view>
							</td>
							<td class="songti">
								<view class="aa">
									登记机构
								</view>
							</td>
							<td class="songti" style="100rpx">
								<view class="aa">
									{{ table1.dengji_jigou }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									抵押开始时间
								</view>
							</td>
							<td class="songti" colspan="4">
								<view class="aa">
									{{ table1.diya_start_time }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									抵押结束时间
								</view>
							</td>
							<td class="songti" colspan="4">
								<view class="aa">
									{{ table1.diya_end_time }}
								</view>
							</td>
						</tr>
						<tr>
							<td class="songti">
								<view class="aa">
									附记
								</view>
							</td>
							<td class="songti" colspan="4">
								<view class="aa">
									无
								</view>
							</td>
						</tr>
					</table>
					<view class="fontt songti" style="transform: scale(0.8);transformOrigin: left;">
						该记录用于：抵押信息核实
					</view>
					<view class="fontt songti" style="transform: scale(0.8);transformOrigin: left;">
						查询范围：{{ card1.fanwei }} </view>
					<view class="zz">
						<view class="fontt songti aa1">
							<!-- <view class="aa1" > -->
							说明：<br />
							1、本记录查询范用为{{
						        card1.fanwei
						    }}不动产登记数据库中的不动产登记信息，本次查询结果与不动产登记簿记载内容不一致的，以不动产登记簿记载内容为准，查询范围:烟台市;2、申请人请当场核实以上身份信息和结果信息，如信息有误请及时联系工作人员，如隐瞒不报或提供虚假信息的，需自行承担法律责任；3、申请人对以上查询中涉及国家秘密、个人隐私和商业秘密的信息负有保密义务，不得泄漏给他人，也不得不正当使用。
							<!-- </view> -->
						</view>
					</view>
					<view class="shijian">
						<view class="fontt songti" style="transform: scale(0.8);"> {{ nian }}&nbsp;&nbsp;{{ ri }}
						</view>
						<view class="fontt songti" style="transform: scale(0.8);"> 烟台不动产登记中心 </view>
					</view>
					<!-- <image src="https://www.zuoxinfangqiye.cn/static/123.png"
						style="width: 100rpx; height: 100rpx;margin-left: 410rpx;margin-top: 200rpx;"></image> -->
				<!-- 	<image src="https://www.zuoxinfangqiye.cn/static/123.png" style="
                            width: 100rpx;
                            height: 100rpx;
                            margin-left: 410rpx;
                            margin-top: -20rpx;
                        "></image> -->
							<image class="gaii" :src="imgUrl+'?'+ new Date().getTime()" style=""></image>
				</view>
			</view>
		</view>
		<view class="liulanq-bottom">
			<view class="guanbi" @click="backFn"> 关闭 </view>
			<view class="load" @click="copyFn"> 复制链接到浏览器下载 </view>
		</view>
		<view> </view>
	</view>
</template>

<script setup>
	import {
		onLoad
	} from '@dcloudio/uni-app'
	import {
		ref
	} from 'vue'
	import {
		getFanwei,
		getTable
	} from '@/api/user'
	const srcUrl = ref(``)
	const webviewStyles = ref({
		progress: {
			color: '#FF3333'
		}
	})
	const backFn = () => {
		uni.navigateBack(-1)
	}
	const backSearch = () => {
		uni.navigateTo({
			url: '/pages/search/search1'
		})
	}
	const imgUrl=ref("https://www.zuoxinfangqiye.cn/static/123.png")
	const copyFn = () => {
		uni.setClipboardData({
			data: card1.value.pdf_img1,
			success: () => {
				uni.showToast({
					title: '复制成功',
					icon: 'none'
				})
			}
		})
	}

	// pdf
	const allUrl = ref('')
	const card1 = ref({})
	onLoad((options) => {
		card1.value = JSON.parse(decodeURIComponent(options.params))
		console.log(card1.value, 'card1.value')
		getaa()
		gettableFn()
		getTime()
	})
	const pdfimg = ref('')
	const getaa = () => {
		const card = card1.value.card
		getFanwei({
			card: card
		}).then((res) => {
			pdfimg.value = res.shuju
			console.log(res, '222222222222222')
		})
	}

	const table1 = ref({})
	const xinxi = ref({})
	const xinxis = ref({
		a: 1,
		b: -1
	})
	const gettableFn = () => {
		const card = card1.value.card
		console.log('啦啦啦阿联')
		getTable({
			card: card
		}).then((res) => {
			table1.value = res.num
			xinxi.value = res.data
			// console.log(table1, 'table1')
			console.log('table1', table1.value)
			if (res.num == null) {
				console.log(31)
				xinxis.value.a = '0'
				//table1.value.xianzhi_status=0
			} else {
				if (table1.value.xianzhi_status == '无') {
					xinxis.value.b = 1
				}
			}
			// console.log(table1.value, 'table1')
			// console.log(xinxi.value, 'xinxi')
		})
	}

	const nian = ref('')
	const ri = ref('')
	const bianhaoo = ref('')
	const bawei = ref('')
	const getTime = () => {
		const date1 = new Date()
		const year = date1.getFullYear()
		const month = date1.getMonth()
		const day = date1.getDate()
		const xinqi = date1.getDay()
		// let hh = date1.getHours();
		const hh = date1.getHours() < 10 ? '0' + date1.getHours() : date1.getHours()
		// let mm = date1.getMinutes();
		const mm = date1.getMinutes() < 10 ? '0' + date1.getMinutes() : date1.getMinutes()
		const ss = date1.getSeconds() < 10 ? '0' + date1.getSeconds() : date1.getSeconds()
		//let date = year + "年" + (month + 1) + "月" + day + "日   星期" + xinqi + "  " + hh + ":" + mm + ":" + ss
		const date = year + '年' + (month + 1) + '月' + day + '日'
		//let  week = "星期" +xinqi //星期6
		const realTime = hh + '时' + mm + '分' + ss + '秒'
		nian.value = date
		ri.value = realTime
		const montg = month + 1
		const month1 = montg < 10 ? '0' + montg : montg
		const day1 = date1.getDate() < 10 ? '0' + date1.getDate() : date1.getDate()
		const aaa = year + '' + month1 + '' + day1 + ''
		bianhaoo.value = aaa
		const shijian = String(new Date().getTime())
		const lastEightDigits = shijian.slice(-8)
		bawei.value = lastEightDigits;
	}
</script>

<style lang="scss">
	/*  @font-face {
    font-family: 'www';
    src: url('/static/font/SourceHanSerifCN-Regular.ttf');
  } */
	/* 在线链接服务仅供平台体验和调试使用，平台不承诺服务的稳定性，企业客户需下载字体包自行发布使用并做好备份。 */
	/* 在线链接服务仅供平台体验和调试使用，平台不承诺服务的稳定性，企业客户需下载字体包自行发布使用并做好备份。 */
	/* @font-face {
  font-family: "www";
  font-weight: 900;
  src: url("//at.alicdn.com/wf/webfont/PV2XZ1VQymUW/ENSSlaxjBZbW.woff2") format("woff2");
} */

	@font-face {
		font-family: 'www';
		font-weight: 900;
		src: url('@/static/font/SourceHanSerifCN-Regular.ttf');
	}

	.songti {
		font-family: 'www';
	}
	
	.gaii{
		position: absolute;
		// bottom:315rpx;
		top: 900rpx;
		right:130rpx;
		width: 120rpx;
		height: 120rpx;
	}

	.aa {
		transform: scale(0.8) !important;
		transformOrigin: 'center center'
			// transform: scale(.5);
			// 		display: inline-block;
			// 		width: 200%;
			// 		transform-origin:0 0 ; 

	}

	.aa1 {
		transform: scale(0.8);
		display: inline-block;
		// width: 140%;
		width: 122%;
		// margin-right: 100%;
		transform-origin: 0 0;
		// overflow: hidden;
	}

	.zz {
		position: relative;
		width: 100%;
		overflow: hidden;
		margin-bottom: -20rpx !important;
	}

	.shijian {
		// margin-top: 2rpx;
		float: right;
		// margin-bottom: 20rpx;
	}

	.biaoge {
		z-index: 30;
		width: 96%;
		margin-left: 2%;
		background-color: #fff;
		height: 950rpx;
		padding-right: 40rpx;
		padding-left: 40rpx;
		// position: relative;
		.biaoge-top {
			text-align: center;
			// padding-top: 20rpx;
			padding-top: 60rpx;
			padding-bottom: 10rpx;
			font-size: 26rpx;
			white-space: 10rpx;
			// word-spacing: 40rpx;
		}

		.biaoge-bianhao {
			font-size: 7rpx;
			text-align: right;
		}

		.table-b {
			border-collapse: collapse;
			width: 100%;
			font-size: 15rpx;
			text-align: center;
			// transform: scale(0.5);

			td,
			th {
				border: 1px solid #000;
				//height: 30rpx;
				height: 25rpx;
				word-wrap: break-word;
				word-break: break-all;
				// padding: 0 !important;
				padding-left: 0 !important;
				padding-right: 0 !important;
			}
		}

		.fontt {
			font-size: 15rpx;
			line-height: 20rpx;
		}
	}

	.search2-top {
		height: 184rpx;
		background: #ffffff;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		opacity: 1;
		padding-top: 96rpx;
		display: flex;

		.search2-top-left {
			width: 10%;

			.search2-top-left-img {
				width: 88rpx;
				height: 88rpx;
			}
		}

		.search {
			width: 10%;

			.search-img {
				width: 88rpx;
				height: 88rpx;
			}
		}

		.search2-top-center {
			font-size: 34rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			color: #333333;
			width: 50%;
			padding-left: 38rpx;
			line-height: 88rpx;
		}

		.search2-top-right {
			width: 30%;
			display: flex;

			.search2-top-button {
				width: 88rpx;
				height: 48rpx;
				border-radius: 4rpx 4rpx 4rpx 4rpx;
				opacity: 1;
				border: 2rpx solid #4678f0;
				line-height: 48rpx;
				text-align: center;
				font-size: 26rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				color: #4678f0;
				margin: auto;
				margin-right: 20rpx;
			}
		}
	}

	.Ownership {
		font-size: 34rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		color: #fff;
		height: 80rpx;
		text-align: center;
		line-height: 80rpx;
		background-color: #5185f5;
	}

	.back-bg {
		background-color: #3e3e3e;
		height: calc(100vh - 264rpx);
		//height:100vh;
		overflow: hidden;
		position: relative;
		width: 750rpx;
		//height: 100vh;
		.top {
			background-color: #474747;
			// height: 90rpx;
			padding: 20rpx 40rpx;
			display: flex;

			.left {
				width: 70%;
				display: flex;

				.fang {
					width: 40rpx;
					height: 40rpx;
					margin-right: 30rpx;
					vertical-align: middle;
				}

				.search {
					width: 40rpx;
					height: 40rpx;
				}

				.left2 {
					width: 130rpx;
					height: 40rpx;
					border: 1rpx solid #000;
					color: #fff;
					text-align: right;
					padding-right: 10rpx;
					margin-left: 30rpx;
					line-height: 40rpx;
					border-radius: 10rpx 10rpx 10rpx 10rpx;
					background: linear-gradient(to right, #5e5e5e 0%, #5c5c5c 100%);
					font-size: 28rpx;
					margin-right: 5rpx;
					box-shadow: 1rpx 1rpx 1rpx 1rpx #353535;
				}

				.left3 {
					color: #fff;
					font-size: 28rpx;
					height: 40rpx;
					line-height: 40rpx;
					letter-spacing: 5rpx;
				}
			}

			.right {
				width: 30%;
				display: flex;

				.jian {
					color: #fff;
					line-height: 40rpx;
					font-size: 40rpx;
				}

				.xian {
					width: 3rpx;
					height: 40rpx;
					background-color: #393939;
					margin-left: 10rpx;
					margin-right: 10rpx;
					// border: 1rpx solid #545452;
				}

				.jia {
					color: #fff;
					line-height: 40rpx;
					font-size: 40rpx;
				}
			}
		}

		.bottom {
			width: 90%;
			margin-left: 5%;
			padding-top: 20rpx;
			// padding-top: 120rpx;
			margin-bottom: 30rpx;
			overflow: hidden;
			// position: ;
			.pdf {
				width: 100%;
			}
		}
	}

	.liulanq-bottom {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		margin-top: 50rpx;
		z-index: 22;
		height: 200rpx;
		background-color: #fff !important;
		padding-left: 60rpx;
		padding-right: 60rpx;
		display: flex;

		.guanbi {
			color: #474747;
			font-size: 28rpx;
			height: 200rpx;
			line-height: 200rpx;
			width: 20%;
		}

		.load {
			// width: 542rpx;
			flex: 1;
			height: 72rpx;
			background: linear-gradient(93deg, #4089ff 0%, #0063ff 100%);
			box-shadow: 0rpx 4rpx 22rpx 0rpx #0465ff;
			border-radius: 36rpx 36rpx 36rpx 36rpx;
			text-align: center;
			line-height: 72rpx;
			font-size: 28rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			color: #ffffff;
			margin-top: 55rpx;
		}
	}
</style>